<?php
session_start();
include_once( 'config.php' );
include_once( 'weibooauth.php' );

$o = new WeiboOAuth(WB_AKEY, WB_SKEY);
$keys = $o->getRequestToken();
$_SESSION['keys'] = $keys;

$aurl = $o->getAuthorizeURL($keys['oauth_token'], false , WB_CALLBACK);

if (isset($_REQUEST['submit'])) {
    $_SESSION['text'] = $_REQUEST['sts1'] . "\n"
                      . $_REQUEST['sts2'] . "\n"
                      . $_REQUEST['sts3'] . "\n";
    header("Location: $aurl");
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>三句话demo</title>
		<script type="text/javascript" src="js/jquery.js"></script>
		<script type="text/javascript" src="js/jquery.stepy.min.js"></script>
		<link type="text/css" rel="stylesheet" href="css/jquery.stepy.css"/>

		<!-- Optionaly -->
		<script type="text/javascript" src="js/jquery.validate.min.js"></script>

		<style type="text/css">
			body {
				font: 10px verdana;
			}

			a#coffee-link, div#coffee-container {
				border-radius: 4px;
				-khtml-border-radius: 4px;
				-moz-border-radius: 4px;
				-opera-border-radius: 4px;
				-webkit-border-radius: 4px;
			}

			div#link a {
				color: #EA9C00;
				font: bold 10px verdana;
				letter-spacing: .9px;
				text-decoration: none;
			}
			
			div#link a:hover {
				color: #DC5;
				font-weight: bold;
				letter-spacing: .9px;
				text-decoration: underline;
			}

			a#coffee-link {
				background: url('img/coffee.png') 6px 2px no-repeat;
				border: 1px solid #D9C640;
				color: #FFF;
				display: block;
				font-weight: bold;
				letter-spacing: .9px;
				padding: 4px 5px 4px 26px;
				text-decoration: none;
			}

			a#coffee-link:hover {
				text-decoration: underline;
			}

			div#coffee-container {
				background-color: #DC5;
				float: right;
				margin-right: 15px;
			}

			div.description {
				color: #555;
				letter-spacing: .1px;
				margin-bottom: 10px;
				text-indent: 7px;
				text-align: left;
				width: 99%;
			}

			div#link {
				color: #AB9927;
				text-indent: 7px;
			}

			div.notice {
				font: 9px verdana;
				color: #777;
				letter-spacing: .1px;
				margin-bottom: 3px;
				text-indent: 7px;
				text-align: left;
				width: 99%;
			}

			div.session {
				font: bold 13px verdana;
				border-bottom: 1px solid #EFEFEF;
				color: #444;
				letter-spacing: .7px;
				margin-bottom: 10px;
				margin-top: 24px;
				text-align: left;
				width: 99%;
			}

			div.source {
				background: #F8F8FF;
				border: 1px solid #EFEFEF;
				border-left: 3px solid #CCC;
				color: #444;
				font: 12px monospace;
				letter-spacing: .1px;
				margin-bottom: 7px;
				margin-top: 5px;
				padding: 7px;
				width: 99%;
			}

			div.text {
				color: #555;
				letter-spacing: .1px;
				margin-bottom: 20px;
				margin-top: 5px;
				text-align: left;
				text-indent: 7px;
				width: 99%;
			}

			div.title {
				font: bold 17px verdana;
				color: #269;
				letter-spacing: .7px;
				margin-bottom: 20px;
				margin-top: 5px;
				text-align: left;
				width: 99%;
			}
			
			span.comment-html, span.comment-script {
				font: 12px monospace;
				letter-spacing: .1px;
				margin-bottom: 7px;
				margin-top: 5px;
			}

			span.comment-html {
				color: #5e85de;
			}

			span.comment-script {
				color: #578F73;
			}

			span#version {
				color: #777;
				font: 10px verdana;
			}

            .sts {
                margin: 5px;
            }
		</style>
	</head>
	<body>
		<div id="custom-demo" class="session">三句话 :</div>		

		<form id="custom" action="" method="post">
			<fieldset title="第一步">
				<legend>留下您的话语</legend>
				<input id="sts1" type="text" class="sts" name="sts1" size="30" value="" /><br />
                <input id="sts2" type="text" class="sts" name="sts2" size="30" value="" /><br />
                <input id="sts3" type="text" class="sts" name="sts3" size="30" value="" /><br />
			</fieldset>

			<fieldset title="第二步">
				<legend>分享</legend>
				<label>姓名：</label> <input type="text" value="名字" size="40" />
				<label>邮箱：</label> <input type="text" name="email" value="xx@xx.xx" size="40" />
				<label>Birthday:</label>
				<select name="day">
					<option>11</option>
				</select>
				<select>
					<option>5</option>
				</select>
				<select>
					<option>1984</option>
				</select>
                <label>性别：</label>
				<input type="radio" name="gender" checked="checked" /> 男生
				<input type="radio" name="gender" /> 女生
            </fieldset>

			<input name="submit" type="submit" class="finish" value="分享" />
		</form><br/>

		<script type="text/javascript">
			$(function() {
				$('#custom').stepy({
					backLabel:	'Backward',
					block:		true,
					errorImage:	true,
					nextLabel:	'Forward',
					titleClick:	true,
					validate:	true,
                    onBack: function(index) {
						//alert('Going to step ' + index + '...');
					},
					onNext: function(index) {
						/*var random = Math.floor(Math.random() * 11);
						if (random <= 5) {
							alert('Invalid value!');
							return false;
						}*/
						//alert('Going to step ' + index + '...');
					}
				});

				// <!-- Optionaly -->
				$('#custom').validate({
					errorPlacement: function(error, element) {
						$('#custom div.stepy-error').append(error);
					},
					rules: {
						'email':	'email',
                        'sts1':     'required',
                        'sts2':     'required',
                        'sts3':     'required',
						'gender':   'required'
					},
					messages: {
						'email':    {email: 'Invalid e-mail!'},
						'sts1':     {required: '请留下您的话语!'},
                        'sts2':     {required: '请留下您的话语!'},
                        'sts3':     {required: '请留下您的话语!'},
                        'gender':   {required: 'Gender field is requerid!'}
					}
				});
			});
		</script>
	</body>
</html>